<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图片的无缝滚动</title>
    <style>
        #box{

            width: 500px;
            height: 220px;
            overflow-x:scroll;                  /*超出的宽度卷起来*/
            overflow-y: hidden;                /*超出的高度隐藏*/
            white-space: nowrap;                /*当有空白时禁止自动换行*/
            background-color:wheat;

        }
        #btn {
            white-space: nowrap;
        }

    </style>
</head>
<body>
        <div id="box">
            <div id="btn">
                <img src="img/1.jpg">
                <img src="img/2.png">
                <img src="img/3.jpg">
                <img src="img/4.jpg">
                <img src="img/5.jpg">



            </div>
        </div>
</body>
</html>